<template>
  <div id="aCoursesList" class="bg-fa of">
    <!-- 讲师列表 开始 -->
    <section class="container">
      <header class="comm-title all-teacher-title">
        <h2 class="fl tac">
          <span class="c-333">正在使用的资产</span>
        </h2>
      </header>
      <section class="c-sort-box unBr">
        <div>
          <!-- /无数据提示 开始-->
          <section v-if="data.total === 0" class="no-data-wrap">
            <em class="icon30 no-data-ico">&nbsp;</em>
            <span class="c-666 fsize14 ml10 vam">没有正在使用的资产...</span>
          </section>
          <!-- /无数据提示 结束-->
          <!-- /数据列表 开始-->
          <article v-if="data.total>0" class="i-teacher-list">
              <ul class="of">
                  <li v-for="item in data.items" :key="item.id">
                      <section class="i-teach-wrap">
                          <div class="i-asset-pic">
                                  <img :src="item.cover" :alt="item.title" height="142">
                          </div>
                          <div class="mt10 hLh30 txtOf tac">
                              <a class="fsize18 c-666">{{ item.title }}</a>
                          </div>
                          <div class="hLh30 txtOf tac">
                              <span class="fsize14 c-999" >{{ item.assetId }}</span>
                          </div>
                          <div class="hLh30 txtOf tac">
                              <span class="fsize14 c-999" >{{ item.gmtCreate }}</span>
                          </div>
                          <div>
                            <el-tag>{{outMap[item.status]}}</el-tag>
                          </div>
                          <div class="mt15 i-q-txt">
                              <p class="c-999 f-fA">{{ item.des }}</p>
                          </div>
                          <div v-if="item.status === 'my'">
                              <el-button type="primary" icon="el-icon-edit" circle @click="backAsset(item.id)"></el-button>
                          </div>
                      </section>
                  </li>
              </ul>
              <div class="clear"/>
          </article>
          <!-- /数据列表 结束-->
        </div>
      </section>
    </section>
    <!-- / 结束 -->
  </div>
</template>
<script>
import asset from '@/api/asset'
export default {
  data(){
    return{
      data:{},
      searchObj:{},
      page:1,
      outMap:{
              'back':'已经驳回',
              'ed':'已经归还',
              'my':'正在使用',
              'ing':'申请借用中',
              'eding':'申请归还中'}
    }
  },
   created () {
   this.initAssetBack()
  },
  methods:{
    initAssetBack(){
      asset.getBackPageList(1, 8,this.searchObj).then(response => {
        this.data = response.data.data
      })
    },
   gotoPage(page) {
      this.page = page
      asset.getBackPageList(page, 8, this.searchObj).then(response => {
        this.data = response.data.data
      })
    },
   backAsset(id) {
      this.$confirm('是否归还该资产?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
          asset.backAsset(id).then(res => {
            this.$message({
              type: 'success',
              message: '归还成功!请将物品交还，等待管理员审核。'
            });
            this.initAssetBack()
      })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消归还'
        });
      });
    }
  }
};
</script>
